<template>
  <div>
    <!-- v-if 相当于js的if 条件成立渲染到页面上 不成立就不渲染 -->
     <p v-if="age < 18">青年</p>
     <p v-if="age > 18 && age < 30">中年</p>
     <p v-else> 老年 </p>
     <!-- v-show 相当于 display:none -->
      <div v-show="age < 50">跳广场舞</div>
      <div v-show="age > 50">学习</div>
  <!-- 
    v-if和v-show的区别
    v-if:先判断那些需要加载，条件不成立不加载，减少服务器压力，按需加载
    v-show:一定会先加载出来 在需要的时候改变 display的显示样式    
  -->
  </div>
</template>
<script>
export default{
  data(){
    return{
      age:20
    }
  },
  methods:{

  }
}
</script>
<style lang="scss">
</style>